<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<link th:href="@{../style/authority/main_css.css}" rel="stylesheet" type="text/css" />
	<link th:href="@{../style/authority/zTreeStyle.css}" rel="stylesheet" type="text/css">
	<!--<script type="text/javascript" th:src="@{../scripts/jquery/jquery-1.7.1.js}"></script>-->
	<script type="text/javascript" th:src="@{../scripts/zTree/jquery.ztree.core-3.2.js}"></script>
	<script type="text/javascript" th:src="@{../scripts/authority/commonAll.js}"></script>
	<link href="https://heerey525.github.io/layui-v2.4.3/layui/css/layui.css" rel="stylesheet" type="text/css">
	<link href="https://heerey525.github.io/layui-v2.4.3/layui/css/layui.css" rel="stylesheet" type="text/css">
	<link th:href="@{../assets/css/layer.css}" rel="stylesheet" type="text/css">
	<script type="text/javascript" src="https://heerey525.github.io/layui-v2.4.3/layui/layui.js"></script>
	<script type="text/javascript" th:src="@{../scripts/zTree/layui.all.js}"></script>
	<link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

	<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
	<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>

	<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
	<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
<title>信息管理系统</title>
<style>
	.alt td{ background:black !important;}
</style>
</head>
<body>
	<form id="submitForm" name="submitForm" action="" method="post">
		<input type="hidden" name="allIDCheck" value="" id="allIDCheck"/>
		<input type="hidden" name="fangyuanEntity.fyXqName" value="" id="fyXqName"/>
		<div id="container">
			<div class="ui_content">
				<div class="ui_tb">
					<table class="table table-bordered table-hover" style="margin:auto;width: 90%;" cellspacing="0" cellpadding="0" width="100%" align="center" border="0">
						<tr>
							<th style="text-align: center;">流程定义ID</th>
							<th style="text-align: center;">流程定义名称</th>
							<th style="text-align: center;">流程定义KEY</th>
							<th style="text-align: center;">版本号</th>
							<th style="text-align: center;">流程部署ID</th>
							<th style="text-align: center;">状态</th>
							<th style="text-align: center;">操作</th>
						</tr>
							<tr th:each="one:${list.list}">

								<td style="text-align: center;" th:text="${one.ID_}"></td>
								<td style="text-align: center;" th:text="${one.RESOURCE_NAME_}"></td>
								<td style="text-align: center;" th:text="${one.KEY_}"></td>
								<td style="text-align: center;" th:text="${one.VERSION_}"></td>
								<td style="text-align: center;" th:text="${one.DEPLOYMENT_ID_}"></td>
								<td style="text-align: center;" th:text="${one.status}"></td>
								<td style="text-align: center;">

									<span th:if="${one.status} eq '已激活'">
										<a title="暂停流程定义" href="javascript:;" onclick="active(this)">暂停</a>
									</span>
									<span th:if="${one.status} eq '已暂停'">
										<a title="激活流程定义" href="javascript:;" onclick="active(this)">激活</a>
									</span>
									<a href="javascript:;" onclick="cklcsl(this)" title="查看流程实例" data-toggle="modal" data-target="#myModal">查看实例</a>
									<a href="javascript:;" title="删除流程定义" onclick="delDefinition(this)">删除</a>
								</td>
							</tr>
						

						
					</table>
				</div>
				<div class="ui_tb_h30">
					<div class="ui_flt" style="height: 30px; line-height: 30px;margin-left: 5%;margin-top: 3%;">
						共有
						<span class="ui_txt_bold04" th:text="${list.total}"></span>
						条记录，当前第
						<span class="ui_txt_bold04" th:text="${list.pageNum}">
							页
						</span>/<span class="ui_txt_bold04" th:text="${list.pages}"></span>页
					</div>
					<div class="ui_frt" style="float: right;margin-right: 6%; margin-top: -2%;">
						<!--    如果是第一页，则只显示下一页、尾页 -->
						
						<a  th:href="@{/workflow/getProcessDefinitions?pn=1}" class="ui_input_btn01" >首页</a>
						<a th:href="@{'/workflow/getProcessDefinitions?pn='+${list.pageNum-1}}" class="ui_input_btn01">上一页</a>
							<a th:href="@{'/workflow/getProcessDefinitions?pn='+${list.pageNum+1}}" class="ui_input_btn01">下一页</a>
							<a th:href="@{'/workflow/getProcessDefinitions?pn='+${list.pages}}" class="ui_input_btn01">尾页</a>
						
						
						

					</div>
				</div>
			</div>
		</div>
	</form>
	<div id="myAlert" class="alert alert-success" style="display: none;">
		<a href="#" class="close" data-dismiss="alert" style="position: absolute;top: 0;">&times;</a>
		<strong>删除成功！</strong>已删除该流程定义！
	</div>
	<div id="myAlert1" class="alert alert-success" style="display: none;">
		<a href="#" class="close" data-dismiss="alert" style="position: absolute;top: 0;">&times;</a>
		<strong>操作成功！</strong>
	</div>
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog" style="width: 70%;">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
					<h4 class="modal-title" id="myModalLabel">流程实例</h4>
				</div>
				<div class="modal-body">
					<table class="table table-hover">
						<thead>
						<tr>
							<th>ID</th>
							<th>流程实例ID</th>
							<th>业务编号</th>
							<th>流程定义ID</th>
							<th>状态</th>
						</tr>
						</thead>
						<tbody id="tbody">

						</tbody>
					</table>

				</div>
				<div class="modal-footer">
					<button type="button" id="close" class="btn btn-default" data-dismiss="modal">关闭</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal -->
	</div>
<script>

	$("#close").click(function () {
		$("#tbody").html("");
    });

	function delDefinition(e) {
		var definitionId=$(e).parent().parent().find("td").eq(4).html();
        layer.confirm("确认删除该流程定义吗？",{btn:['确认','取消']},function () {
            $.post(
                "/workflow/delProcessDefinitionById",
                {id:definitionId},
                function (data) {
                    layer.msg('删除成功', {
                        time: 1000, //2s后自动关闭
                    });
                    setTimeout(function () {
                        window.location.href=window.location.href;
                    },1000);

                }
            );
        },function () {
            //取消之后的操作
        })
    }

    function active(e) {
		var font=$(e).html();
		var allFont="确认"+font+"吗？";
        var id=$(e).parent().parent().parent().find("td").eq(0).html();
        layer.confirm(allFont,{btn:['确认','取消']},function () {
            $.post(
                "/workflow/active",
                {id:id},
                function (data) {
                    if(data==1){
                        layer.msg('操作成功', {
                            time: 1000, //2s后自动关闭
                        });
                        setTimeout(function () {
                            window.location.href=window.location.href;
                        },1000);
					}else{
                        layer.msg('操作失败，请检查网络配置', {
                            time: 1000, //2s后自动关闭
                        });
					}

                }
            );
        },function () {
            //取消之后的操作
        })

    }

    function cklcsl(e){
        var id=$(e).parent().parent().find("td").eq(0).html();
        $.post(
            "/workflow/getProcessExcutionByProcessDefinitionId",
			{id:id},
			function (data) {
				var str='';
				for(var i=0;i<data.length;i++){
				    if(data[i].status=="存活中---"){
				        status="存活中--";
					}else{
				        status="已死亡";
					}
				    str+='<tr><td>'+data[i].id_+'</td>' +
						'<td>'+data[i].proc_INST_ID_+'</td>' +
						'<td>'+data[i].business_KEY_+'</td>' +
						'<td>'+data[i].proc_DEF_ID_+'</td>' +
						'<td style="color: blueviolet;">'+status+'</td></tr>';
				}
				$("#tbody").append(str);
            }
		);
	}

</script>
</body>
</html>
